﻿<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <!-- Required meta tags -->
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>

    <!-- Meta -->
    <meta name="description" content="购物信息管理"/>
    <meta name="author" content="WY"/>

    <link rel="shortcut icon" th:href="@{/admin/picture/favicon.ico}" type="image/x-icon"/>
    <title>购物信息管理</title>

    <!-- vendor css -->
    <link th:href="@{/admin/css/font-awesome.css}" rel="stylesheet"/>
    <link th:href="@{/admin/css/ionicons.css}" rel="stylesheet"/>
    <link th:href="@{/admin/css/perfect-scrollbar.css}" rel="stylesheet"/>
    <link th:href="@{/admin/css/github.css}" rel="stylesheet"/>
    <link th:href="@{/admin/css/select2.min.css}" rel="stylesheet"/>

    <!-- Starlight CSS -->
    <link rel="stylesheet" th:href="@{/admin/css/starlight.css}"/>
</head>

<body>

<!-- ########## START: LEFT PANEL ########## -->
<div class="sl-logo"><a href=""><img th:src="@{/admin/picture/mt_logo_wh.jpg}" style="width: 30px; height: 30px;"/> <span
        style="font-size: 18px">购物信息管理</span></a></div>
<div class="sl-sideleft">

    <label class="sidebar-label">导航栏</label>
    <div class="sl-sideleft-menu">
       <a href="#" class="sl-menu-link">
            <div class="sl-menu-item">
                <i class="menu-item-icon icon ion-ios-gear-outline tx-24"></i>
                <span class="menu-item-label">会员管理</span>
                <i class="menu-item-arrow fa fa-angle-down"></i>
            </div><!-- menu-item -->
        </a><!-- sl-menu-link -->
        <ul class="sl-menu-sub nav flex-column" >
            <li class="nav-item"><a th:href="@{/root/findAllAdminByLevel}" class="nav-link">会员列表</a></li>
        </ul>
        <a href="#" class="sl-menu-link">
            <div class="sl-menu-item">
                <i class="menu-item-icon icon ion-ios-gear-outline tx-24"></i>
                <span class="menu-item-label">酒店管理</span>
                <i class="menu-item-arrow fa fa-angle-down"></i>
            </div><!-- menu-item -->
        </a><!-- sl-menu-link -->
        <ul class="sl-menu-sub nav flex-column" >
            <li class="nav-item"><a th:href="@{/root/findAllHotels}" class="nav-link">酒店列表</a></li>
            <li class="nav-item"><a th:href="@{/root/addHotel}" class="nav-link">酒店添加</a></li>
            <li class="nav-item"><a th:href="@{/root/delHotel}" class="nav-link">酒店删除</a></li>
        </ul>

        </div><!-- navicon-right -->
    </div><!-- sl-header-right -->
</div><!-- sl-header -->
<!-- ########## END: HEAD PANEL ########## -->

<!-- ########## START: RIGHT PANEL ########## -->

<!-- ########## END: RIGHT PANEL ########## -->

<!-- ########## START: MAIN PANEL ########## -->
<div class="sl-mainpanel">
    <nav class="breadcrumb sl-breadcrumb">
        <a class="breadcrumb-item" href="index.html">购物信息管理</a>
        <span class="breadcrumb-item active">新增购物信息</span>
    </nav>

    <div class="sl-pagebody">
        <!-- <div class="sl-page-title">
          <h5>Form Layouts</h5>
          <p>Forms are used to collect user information with different element types of input, select, checkboxes, radios and more.</p>
        </div> -->
        <!-- sl-page-title -->

        <div class="card pd-20 pd-sm-40 form-layout form-layout-4">
            <h6 class="card-body-title">新增商店</h6>
            <p class="mg-b-20 mg-sm-b-30">Add Shop.</p>

            <form th:action="@{/manager/add}" method="post" id="addUserForm" enctype="multipart/form-data" onsubmit="return valiForm();">
                <div class="row mg-t-20">
                    <label class="col-sm-2 form-control-label"> 资源分类<span
                            class="tx-danger">*</span>
                    </label>
                    <div class="col-sm-3 mg-t-10 mg-sm-t-0">
                        <!--<input type="text" class="form-control" name="sh_cate"
                               onblur="validateName()"/>
                        <span class="col-sm-12 mt-t-10 mg-sm-t-0 form-control-label" style="color: red; font-size:12px;"
                              id="nameInfo"/>-->
                        <select name="sh_cate" class="form-control">
                            <option>1</option>
                            <option>2</option>
                            <option>3</option>
                            <option>4</option>
                        </select>
                    </div>
                </div><!-- row -->
                <div class="row mg-t-20">
                    <label class="col-sm-2 form-control-label"> 地理位置<span
                            class="tx-danger">*</span></label>
                    <div class="col-sm-3 mg-t-10 mg-sm-t-0">
                        <input type="text" class="form-control" name="sh_area"
                               onblur="validateName()"/>
                        <span class="col-sm-12 mt-t-10 mg-sm-t-0 form-control-label" style="color: red; font-size:12px;"
                              id="nameInfo"/>
                    </div>
                </div><!-- row -->
                <div class="row mg-t-20">
                    <label class="col-sm-2 form-control-label"> 预览图<span
                            class="tx-danger">*</span></label>
                   <!-- <div class="col-sm-3 mg-t-10 mg-sm-t-0">
                        <input type="text" class="form-control" name="sh_image_pre"
                               onblur="validateName()"/>
                        <span class="col-sm-12 mt-t-10 mg-sm-t-0 form-control-label" style="color: red; font-size:12px;"
                              id="nameInfo"/>
                    </div>-->
                    <div class="col-sm-3 mg-t-10 mg-sm-t-0">
                        <input type="file" class="form-control" name="image"
                               onblur="validateName()"/>
                        <span class="col-sm-12 mt-t-10 mg-sm-t-0 form-control-label" style="color: red; font-size:12px;"
                              id="nameInfo"/>
                    </div>
                </div><!-- row -->


                <div class="row mg-t-20">
                    <label class="col-sm-2 form-control-label"> 名  称<span class="tx-danger">*</span></label>
                    <div class="col-sm-3 mg-t-10 mg-sm-t-0">
                        <input type="text" class="form-control" name="sh_name"
                               onblur="validatePhone()"/>
                        <span class="col-sm-12 mt-t-10 mg-sm-t-0 form-control-label" style="color: red; font-size:12px;"
                              id="phoneInfo"/>
                    </div>
                </div>
                <div class="row mg-t-20">
                    <label class="col-sm-2 form-control-label"> 地  址<span class="tx-danger">*</span></label>
                    <div class="col-sm-3 mg-t-10 mg-sm-t-0">
                        <input type="text" class="form-control" name="sh_address"
                               onblur="validatePhone()"/>
                        <span class="col-sm-12 mt-t-10 mg-sm-t-0 form-control-label" style="color: red; font-size:12px;"
                              id="phoneInfo"/>
                    </div>
                </div>
                <div class="row mg-t-20">
                    <label class="col-sm-2 form-control-label"> 电  话<span class="tx-danger">*</span></label>
                    <div class="col-sm-3 mg-t-10 mg-sm-t-0">
                        <input type="text" class="form-control" name="sh_phone"
                               onblur="validatePhone()"/>
                        <span class="col-sm-12 mt-t-10 mg-sm-t-0 form-control-label" style="color: red; font-size:12px;"
                              id="phoneInfo"/>
                    </div>
                </div>
                <div class="row mg-t-20">
                    <label class="col-sm-2 form-control-label"> 商店描述<span class="tx-danger">*</span></label>
                    <div class="col-sm-3 mg-t-10 mg-sm-t-0">
                        <input type="text" class="form-control" name="sh_des"
                               onblur="validatePhone()"/>
                        <span class="col-sm-12 mt-t-10 mg-sm-t-0 form-control-label" style="color: red; font-size:12px;"
                              id="phoneInfo"/>
                    </div>
                </div>
                <div class="row mg-t-20">
                    <label class="col-sm-2 form-control-label"> 简  述<span class="tx-danger">*</span></label>
                    <div class="col-sm-3 mg-t-10 mg-sm-t-0">
                        <input type="text" class="form-control" name="sh_des_pre"
                               onblur="validatePhone()"/>
                        <span class="col-sm-12 mt-t-10 mg-sm-t-0 form-control-label" style="color: red; font-size:12px;"
                              id="phoneInfo"/>
                    </div>
                </div>
                <div class="form-layout-footer mg-t-30">
                    <button class="btn btn-info mg-r-5" type="submit">确认添加</button>
                    <button class="btn btn-secondary" type="reset">清&nbsp;&nbsp;&nbsp;&nbsp;空</button>
                </div><!-- form-layout-footer -->
            </form>
        </div><!-- card -->
    </div><!-- sl-pagebody -->
    <footer class="sl-footer">
        <div class="footer-left">
            <div class="mg-b-2">Copyright &copy; 2018. 中原工学院信息商务学院. All Rights Reserved.</div>
        </div>
        <div class="footer-right d-flex align-items-center">Made by 信息技术系.</div>
    </footer>
</div><!-- sl-mainpanel -->


<!-- ########## END: MAIN PANEL ########## -->

<script th:src="@{/admin/js/jquery.js}"></script>
<script th:src="@{/admin/js/popper.js}"></script>
<script th:src="@{/admin/js/bootstrap.js}"></script>
<script th:src="@{/admin/js/jquery-ui.js}"></script>
<script th:src="@{/admin/js/perfect-scrollbar.jquery.js}"></script>
<script th:src="@{/admin/js/highlight.pack.js}"></script>
<script th:src="@{/admin/js/select2.min.js}"></script>
<script th:src="@{/admin/js/jquery.md5.js}"></script>
<script th:src="@{/admin/js/starlight.js}"></script>

<script>
    $(function () {
        'use strict';

        $('.select2').select2({
            minimumResultsForSearch: Infinity
        });

        // Select2 by showing the search
        $('.select2-show-search').select2({
            minimumResultsForSearch: ''
        });

        $('.select3').select2({
            minimumResultsForSearch: Infinity
        });

        $('.select3-show-search').select3({
            minimumResultsForSearch: ''
        });

        // Select2 with tagging support
        $('.select2-tag').select2({
            tags: true,
            tokenSeparators: [',', ' ']
        });

        // Datepicker
        $('.fc-datepicker').datepicker({
            showOtherMonths: true,
            shouOtherYear: true,
            selectOterYear: true,
            selectOtherMonths: true
        });


    });


</script>

<script th:inline="javascript">

    /*<![CDATA[*/

   /* // 验证用户所在公司
    function valiCc() {
        var companyId = $('select[name="sh_area"]');
        var ccInfo = $("#ccInfo");
        var ccDiv = $("#ccDiv");
        ccInfo.html("");
        if (companyId.val() == null || ($.trim(companyId.val())) == "") {
            ccInfo.html("请选择用户所在公司");
            ccDiv.addClass("has-danger");
            return false;
        } else {
            ccDiv.removeClass("has-danger");
        }
        return true;
    }*/

  /*  // 验证用户名是否为空
    function validateName() {
        var name = $('input[name="sh_name"]');
        var nameInfo = $("#nameInfo");
        nameInfo.html("");
        if (name.val() == null || ($.trim(name.val())) == "") {
            nameInfo.html("商店名称不能为空！");
            name.addClass("is-invalid");
            return false;
        } else {
            name.removeClass("is-invalid");
        }
        return true;
    }*/

    // 验证密码
    function valiPwd() {
        var pwd = $("#pwd");
        var password = $.md5(pwd.val());
        var pwdInfo = $("#pwdInfo");
        pwdInfo.html("");
        if (pwd.val() == null || ($.trim(pwd.val())) == "") {
            pwdInfo.html("用户密码不能为空！");
            pwd.addClass("is-invalid");
            $("#pwdInfo").css('display', 'block');
            return false;
        } else if(pwd.val().trim().length < 6){
            pwdInfo.html("用户密码不能低于6位！");
            $("#pwdInfo").css('display', 'block');
            pwd.addClass("is-invalid");
            return false;
        } else {
            $('input[name="password"]').val(password);
            pwd.removeClass("is-invalid");
        }
        return true;
    }

    // 验证确认密码
    function valiRePwd() {
        var pwd = $("#pwd");
        var Repwd = $("#repwd");
        var repassword = $.md5(Repwd.val());
        var RepwdInfo = $("#RepwdInfo");
        RepwdInfo.html("");
        if (Repwd.val() == null || ($.trim(Repwd.val())) == "") {
            RepwdInfo.html("用户密码不能为空！");
            Repwd.addClass("is-invalid");
            $("#RepwdInfo").css('display', 'block');
            return false;
        } else if (Repwd.val() != pwd.val()) {
            RepwdInfo.html("两次输入密码不一致！");
            $("#RepwdInfo").css('display', 'block');
            Repwd.addClass("is-invalid");
            return false;
        } else if (Repwd.val().trim().length < 6) {
            RepwdInfo.html("用户密码不能低于6位！");
            $("#RepwdInfo").css('display', 'block');
            Repwd.addClass("is-invalid");
            return false;
        } else {
            $('input[name="repeatPassword"]').val(repassword);
            Repwd.removeClass("is-invalid");
        }
        return true;
    }

    // 验证客户手机号
  /*  function validatePhone() {
        var phone = $('input[name="sh_phone"]');
        var phoneInfo = $("#phoneInfo");
        var pattern = /^1[34578]\d{9}$/;
        phoneInfo.html("");
        if ((phone.val() == null || ($.trim(phone.val())) == "")) {
            phoneInfo.html("客户联系方式不能为空！");
            phone.addClass("is-invalid");
            return false;
        } else if (!(pattern.test(phone.val().toString()))) {
            phoneInfo.html("用户手机号格式不正确！");
            phone.addClass("is-invalid");
            return false;
        } else {
            phone.removeClass("is-invalid");
        }
        return true;
    }

    function valiForm() {
        if (validateName() && validatePhone() && valiPwd() && valiRePwd() && valiCc()) {
            return true;
        } else {
            validateName();
            validatePhone();
            valiCc();
            valiPwd();
            valiRePwd()
            return false;
        }
    }
*/
    /*]]>*/

</script>
</body>
</html>
